import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter_enjoy_plus/utils/eventbus.dart';
import 'package:flutter_enjoy_plus/utils/http.dart';
import 'package:flutter_enjoy_plus/utils/logger.dart';
import 'package:flutter_enjoy_plus/utils/toast.dart';
import 'package:flutter_enjoy_plus/utils/token.dart';

class LoginPage extends StatefulWidget {
  const LoginPage({super.key});

  @override
  State<LoginPage> createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
// 倒计时秒数
  int _countDownSec = 60;
// 是否正在倒计时，节流阀
  bool _isCountDown = false;
// 倒计时计时器
  Timer? _timer;
  // 获取验证码开始倒计时
  _startCountDown() async {
    // 如果正在倒计时，不执行
    if (_isCountDown) return;
    // 如果进来，说明第一次执行，把正在执行设置为true
    // 防止多次点击
    _isCountDown = true;

    // 防止多次发送请求
    final res =
        await http.get('/code', params: {'mobile': _phoneController.text});
    // 如果业务成功
    if (res['code'] != 10000) return ToastUtil.showError('验证码发送失败');
    _codeController.text = res['data']['code'];

    // 开始倒计时
    _timer = Timer.periodic(Duration(seconds: 1), (timer) {
      setState(() {
        if (_countDownSec > 1) {
          // 正常递减
          _countDownSec--;
        } else {
          // 倒计时结束，重置所有属性
          _countDownSec = 60;
          _isCountDown = false;
          _timer?.cancel();
        }
      });
    });
  }

  // 输入框控制器，用于获得内容
  final _phoneController = TextEditingController();
  final _codeController = TextEditingController();

  // 验证手机数据
  _verifyPhone() {
    // 非空判断
    if (_phoneController.text.isEmpty) return ToastUtil.showError('请输入手机号');

    // 手机号正则校验,r为忽略转义
    RegExp regExp = RegExp(r'^1[3-9]\d{9}$');
    if (!regExp.hasMatch(_phoneController.text)) {
      return ToastUtil.showError('请输入正确的手机号码');
    }

    // 格式正确， 发送验证码
    _startCountDown();
  }

  // 登录函数
  _login() async {
    // 1、判断手机号和验证码
    // 手机号-非空
    if (_phoneController.text.isEmpty) return ToastUtil.showError('请输入手机号');

    // 手机号-校验
    RegExp regExp = RegExp(r'^1[3-9]\d{9}$');
    if (!regExp.hasMatch(_phoneController.text)) {
      return ToastUtil.showError('请输入正确的手机号码');
    }

    // 密码-非空
    if (_codeController.text.isEmpty) return ToastUtil.showError('请输入验证码');

    // 密码-校验
    RegExp regExp1 = RegExp(r'^\d{6}$');
    if (!regExp1.hasMatch(_codeController.text)) {
      return ToastUtil.showError('请输入正确的验证码');
    }
    // 2、发送请求并判断是否成功
    final res = await http.post('/login',
        {'mobile': _phoneController.text, 'code': _codeController.text});
    logger.i(res);
    if (res['code'] != 10000) {
      return ToastUtil.showError('登录失败');
    }
    // logger.i('${res['code']} - ${res['data']} = ${res['data']['token']}');
    // 3、存储token
    TokenManager().setToken(res['data']['token']);
    // logger.i('token为${TokenManager().getToken()}');
    ToastUtil.showSuccess('登录成功');
    // 4、清除验证码定时器
    _timer?.cancel();
    // 5、返回上一页
    Navigator.pop(context);

    // 登录成功后，通知我的页面更新
    eventBus.fire(RefreshMineEvent());
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Colors.white,
        appBar: AppBar(
          title: const Text('登录'),
          backgroundColor: Colors.transparent,
          centerTitle: true,
        ),
        body: Container(
            padding: const EdgeInsets.all(20),
            child:
                Column(mainAxisAlignment: MainAxisAlignment.start, children: [
              const Row(
                children: [
                  Text('登录',
                      style:
                          TextStyle(fontSize: 25, fontWeight: FontWeight.bold))
                ],
              ),
              const SizedBox(height: 10),
              const Row(
                children: [
                  Text('加入享+, 让生活更轻松', style: TextStyle(fontSize: 15))
                ],
              ),
              const SizedBox(height: 30),
              Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Expanded(
                    child: TextField(
                      decoration: const InputDecoration(
                        labelText: '手机号',
                        hintText: '请输入手机号',
                      ),
                      controller: _phoneController,
                      maxLength: 11,
                      keyboardType: TextInputType.phone,
                    ),
                  ),
                  ElevatedButton(
                    style: ElevatedButton.styleFrom(
                      backgroundColor: Colors.white,
                      shadowColor: Colors.transparent,
                      foregroundColor: const Color.fromARGB(255, 85, 145, 175),
                      minimumSize: const Size(100, 50),
                    ),
                    onPressed: () {
                      // 验证手机号，验证成功后发送验证码
                      _verifyPhone();
                    },
                    child: _isCountDown
                        ? Text(
                            '$_countDownSec s后倒计时结束',
                            style: const TextStyle(color: Colors.grey),
                          )
                        : const Text('获取验证码'),
                  ),
                ],
              ),
              const SizedBox(height: 8),
              TextField(
                decoration: const InputDecoration(
                  labelText: '验证码',
                  hintText: '请输入6位验证码',
                ),
                controller: _codeController,
                maxLength: 6,
                keyboardType: TextInputType.number,
              ),
              const SizedBox(height: 8),
              const Row(children: [
                Text('未注册手机号经验证后将自动登录',
                    style: TextStyle(fontSize: 12, color: Colors.grey)),
              ]),
              const SizedBox(height: 50),
              Row(children: [
                Expanded(
                    child: ElevatedButton(
                  style: ElevatedButton.styleFrom(
                    backgroundColor: const Color.fromARGB(255, 85, 145, 175),
                    minimumSize: const Size(100, 50),
                  ),
                  onPressed: () {
                    // 登录函数
                    _login();
                  },
                  child: const Text('登录',
                      style: TextStyle(color: Colors.white, fontSize: 20)),
                ))
              ])
            ])));
  }
}
